<template>
    <div class="lefttop" style="margin-top: 20px;">
      <h1 style="margin-top: -15px;margin-left: 5px;font-size: 25px;">近七日人口涌入统计</h1>
      <div style="margin-top: 30px;">
          <el-tabs tab-position="bottom" style="height: 200px;" class="demo-tabs">
    <el-tab-pane label="北京"><BjLinechart></BjLinechart></el-tab-pane>
    <el-tab-pane label="上海"><ShLinechart></ShLinechart></el-tab-pane>
    <el-tab-pane label="深圳"><SzLinechart></SzLinechart></el-tab-pane>
    <el-tab-pane label="广州"> <GzLinechart></GzLinechart></el-tab-pane>
  </el-tabs>
      </div>
      
    </div>
    </template>
    <script>
    import BjLinechart from './BjLinechart.vue'
    import ShLinechart from './ShLinechart.vue'
    import SzLinechart from './SzLinechart.vue'
    import GzLinechart from './GzLinechart.vue'
    export default{
        data(){
            return{
                
            }
        },
        components:{
            BjLinechart,ShLinechart,SzLinechart,GzLinechart
        }
    }
    </script>
    <style lang="scss" scoped >
    *{
      color: white
    }
.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #3c65b6;
  font-size: 32px;
  font-weight: 600;
  border: white 1px solid;
}
.demo-tabs{
  // border: white 1px solid;
  margin-top: 10px;
  width: 440px;
  margin-left: 16px;
  // height: 300px;
}

.el-tabs--right .el-tabs__content,
.el-tabs--left .el-tabs__content {
  height: 100%;
  /* border: red 1px solid; */
}
::v-deep .el-tabs__item {
  margin-top: -29px;
    color: white;
    font-size: 20px;
}
</style>